<template>
  <div class="home">
    <div class="home-container">
      <Swiper />
      <Recommend />
      <NewRecommend />
    </div>
    <!-- <WindowMessageBox msg="操作成功" status="error" /> -->
  </div>
</template>
<script>
import Swiper from "./components/Swiper/Swiper";
import Recommend from "./components/Recommend/Recommend";
import NewRecommend from "./components/Recommend/NewRecommend";
import WindowMessageBox from "@/commonPages/commonComponents/WindowMessageBox";

export default {
  components: {
    Swiper,
    Recommend,
    NewRecommend,
    // eslint-disable-next-line vue/no-unused-components
    WindowMessageBox
  }
};
</script>
<style lang="scss" scoped>
@import "@/style/common.scss";
@media screen and (min-width: 1200px) {
  .home {
    padding: 0 20px 20px 20px;
    min-width: 1100px;
    margin: 0 auto;
  }
}
@media screen and (max-width: 1200px) and (min-width: 992px) {
  .home {
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin: 0 auto;
  }
}
@media screen and (max-width: 992px) and (min-width: 768px) {
}
@media screen and (max-width: 768px) and (min-width: 576px) {
}
@media screen and (max-width: 576px) {
  .home {
    width: 100%;
    margin: 0 auto;
  }
}
</style>
